import { $t } from '@vben/locales';

import { getDepartmentList, updateDepartment } from '#/api/sys/department';
import switchStatus from '#/components/FosoSwitch/index.vue';
import { buildMenuTree } from '#/utils/treetransform';

// 表单配置
export const FormSchemas = [
  {
    fieldName: 'name',
    rules: 'required',
  },
  {
    component: 'ApiTreeSelect', // 树形下拉选择器
    componentProps: {
      placeholder: '请选择',
      style: {
        width: '200px',
      },
      checkStrictly: true, // 支持选择任意一级
      // 返回后数据处理
      afterFetch: (data: any) => {
        const newdata = buildMenuTree(data.data, 0);
        const resultData = [
          {
            name: '设为一级部门',
            id: 0,
          },
          ...newdata,
        ];

        return resultData;
      },
      api: getDepartmentList, // API支持
      // 请求参数
      params: {
        page: 1,
        pageSize: 5000,
      },
      labelField: 'name',
      valueField: 'id',
      childrenField: 'children',
    },
    fieldName: 'parentId',
    rules: 'required',
  },
  {
    help: $t('sys.department.ancestorsHelpMessage'),
    fieldName: 'ancestors',
    componentProps: {
      placeholder: ' ',
      disabled: true,
    },
  },
  {
    fieldName: 'leader',
    rules: 'required',
  },
  {
    fieldName: 'phone',
    rules: 'required',
  },
  {
    fieldName: 'email',
    rules: 'required',
  },
  {
    fieldName: 'sort',
    rules: 'required',
  },
  {
    fieldName: 'remark',
    componentProps: {
      type: 'textarea',
      rows: 4,
      maxlength: 200,
      showWordLimit: true,
    },
  },
  {
    component: 'RadioGroup',
    defaultValue: '1',
    componentProps: {
      isButton: true,
      options: [
        {
          label: $t('sys.role.start'),
          value: '1',
        },
        {
          label: $t('sys.role.stop'),
          value: '0',
        },
      ],
    },
    fieldName: 'status',
  },
];
// 表格列配置
export const tableColumns = computed(() => [
  {
    type: 'checkbox',
    width: 60,
  },
  {
    title: $t('sys.department.departmentName'),
    field: 'name',
    minWidth: 120,
    treeNode: true,
  },
  {
    title: $t('sys.department.leader'),
    field: 'leader',
    minWidth: 120,
  },
  {
    title: $t('common.status'),
    field: 'status',
    minWidth: 120,
    slots: {
      default: ({ row }: { row: any }) => {
        return h(switchStatus, {
          // 1：启动 0：禁用
          status: row.status,
          /**
           * @todo 切换状态报错
           */
          'onUpdate:status': async (value: any) => {
            await updateDepartment({
              id: row.id,
              status: value,
            });
            row.status = value;
            ElMessage.success($t('common.operateSuccess'));
          },
        });
      },
    },
  },
  {
    title: $t('common.createTime'),
    field: 'createdAt',
    minWidth: 120,
    formatter: 'formatDateTime',
  },
  // 操作
  {
    title: $t('sys.role.operation'),
    minWidth: 200,
    slots: { default: 'action' },
  },
]);
